<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <!--weui.min.css-->
    <link rel="stylesheet" href="/static/index/css/page/base.css"/>
    <link rel="stylesheet" href="/static/index/css/page/font.css"/>
    <link rel="stylesheet" type="text/css" href="/static/index/jquery_weui/lib/weui.min.css">
    <!--jquery-weui.min.css-->
    <link rel="stylesheet" type="text/css" href="/static/index/jquery_weui/css/jquery-weui.min.css">
    <link rel="stylesheet" href="/static/index/css/page/login.css" />
    <style>
    	.agree{
    		font-size:14px;
    		margin-left: 6%;
    		margin-top: 5%;
    	}
    	.login-btn1{
    		border: 0;
    	}
    </style>
</head>
<body>
<div class="pageControl login_deng">
    <div class="msui_nav msui_navTop">
        <a class="msui_navTop-back" href="javascript:history.back();"><i class="micon-back"></i></a>
        <h1 class="msui_navTop-title">注册</h1>
    </div>
    <div class="pl">
        <img src="/static/index/images/login_bg.jpg" alt="">
        <div class="login_zhu_main">
            <div class="login-img">
                <img src="/static/index/img/logo2.png" alt="" style="width:6rem;height:7.5rem;margin-left:-0.5rem;margin-top:-2rem;">
            </div>
            <div class="login-input">
                <div class="login-label">
                    <label>+86</label>
                </div>
                <div class="weui-cell__bd">
                    <input type="text" id="tel" class="weui-input"/>
                </div>
            </div>
            <div class="login-input top-5">
                <div class="weui-cell__bd">
                    <input type="text" class="weui-input" id="code" placeholder="随机验证码"/>
                </div>
                <img id="captcha" src="{:captcha_src()}" alt="验证码" title="点击刷新验证码" style="cursor:pointer;width: 4rem;height: 1.3rem">
            </div>

            <div class="login-input top-5">
                <div class="weui-cell__bd">
                    <input type="text" class="weui-input" id="sms_code" placeholder="短信验证码"/>
                </div>
                <div class="weui-cell__ft">
                    <button class="personal-btn1 js-verify  fs07 cl-f">发送验证码</button>
                </div>
            </div>
            <div class="login-input top-5">
                <div class="weui-cell__bd">
                    <input type="password" id="pwd" class="weui-input" placeholder="请输入6-16位密码"/>
                </div>
            </div>
            <div class="login-input top-5">
                <div class="login-label">
                    <label>性别：</label>
                </div>
                <div id='sex' class="weui-cell__bd login-radio">
                    <div class="flex-row">
                        <label for="s1">男</label>
                        <input id="s1" type="radio" name="checkbox1" checked="checked" class="weui-check1" value="1"/>
                        <span class="weui-icon-checked login-checked"></span>
                    </div>
                    <div class="flex-row">
                        <label for="s2">女</label>
                        <input id="s2" type="radio" name="checkbox1" class="weui-check1" value="0" />
                        <span class="weui-icon-checked"></span>
                    </div>
                </div>
            </div>
            <div class="top-5 agree"><input type="checkbox" id="agree" value="1">注册即代表阅读并同意<a href="/index/login/term" style="color:blue;">服务与条款</a></div>
            <div class="login-flex">
                <button disabled="disabled" class="login-btn1 cl-6666 bg-fff register">立即注册</button>
            </div>
            <div class="login-txt">
                <a href="/index/login/login_deng" class="text-center cl-6666">已有帐号？去登录</a>
                <div class="login-x"></div>
            </div>
        </div>
    </div>

</div>
<!-- jquery-2.1.4 -->
<script type="text/javascript" src="/static/index/jquery_weui/lib/jquery-2.1.4.js"></script>
<!-- jquery-weui.min.js -->
<script type="text/javascript" src="/static/index/jquery_weui/js/jquery-weui.min.js"></script>
<script src="/static/index/js/login.js"></script>
<script type="text/javascript" src="/static/admin/lib/layer/2.4/layer.js"></script>
<script>

    $('.weui-input').focus(function () {
        var mshuaTop=$(this).offset().top-100;
        $('html, body').animate({
            scrollTop: mshuaTop
        }, 400);
    })

	$(function (){
		$(".login-btn1").css('background','#C7C7C7');
//		$(".login-btn1").removeClass("register");
	})
	/*刷新随机验证码*/
	$("#captcha").click(function () {
            $(this).attr("src","{:captcha_src()}?t="+new Date().getTime())
    });


    $(".login-radio").on("click",".flex-row",function(){
        $(this).siblings().children('input').removeAttr('checked').next().removeClass('login-checked');
        $(this).children('input').attr('checked','checked').next().addClass('login-checked')

    })

    function verifyCode(target,time,mtarget,message) {
        if (time == 0) {
            target.removeAttr('disabled');
            target.html('获取验证码');
            if (mtarget) {
                mtarget.closest('p').css('display', 'none');
                mtarget.html(message);
            }
        }else {
            target.attr('disabled', 'disabled');
            target.html(time + 's后可以重新获取');
            if (mtarget) {
                mtarget.closest('p').css('display', 'block');
                mtarget.html(message);
            }
            time--;
            setTimeout(function () {
                verifyCode(target, time);
            }, 1000)
        }
    }
    $('.js-verify').on('click',function(e){
    	/*验证手机号码*/
		var re;
	    var tel=$("#tel").val();
	    var code=$("#code").val();
	    var type = 1;//type = 1为注册
	    re= /^0?(13|14|15|17|18)[0-9]{9}$/
	    if(re.test(tel))
	    {
	    	$.post(
				"/index/sms/phone",
				{tel: tel,code: code,type: type},
			    function(data){
			    	if(data == -1){
			    		alert("该手机号码已被注册！");
			    	}else if(data == -2){
			    		alert('随机验证码错误！');
			    		$('#code').val('');
			    	}
		   		}
			);
	    	e.preventDefault();
       		verifyCode($(this),60);
	    }else{
	    	alert('请输入正确的手机号码！');
	    }
    });

    /*注册*/
	$(".register").click(function(){
		tel = $("#tel").val();
		pwd = $("#pwd").val();
		code = $("#sms_code").val();
		sex = $('#sex input[name="checkbox1"]:checked ').val();
		$.post(
			"/index/login/register",
			{ tel:tel,code:code,pwd:pwd,sex:sex},
		    function(data){
		    	if(data == 1){
		    		alert('注册成功');window.location.href="/index/login/login_deng"
		    	}
		    	if(data == -1){
		    		alert('该手机号码已被注册！');
		    	}
		    	if(data == -2){
		    		alert("密码只能包含数字,字母,'_','-'组成");
		    	}
		    	if(data == -3){
		    		alert('手机验证码错误！');
		    	}
		    	if(data == -4){
		    	    alert('请设置密码长度为6-16');
                }
		    	
		    }
		)
	});
	/*使用服务与条款*/
	$("#agree").click(function (){
		$is_agree = $("input[type='checkbox']").is(':checked');
		if($is_agree){
			$(".login-btn1").css('background','#4fb0c0').removeAttr('disabled');
		}else{
			$(".login-btn1").css('background','#C7C7C7').attr('disabled','disabled');
		}
	});
	
</script>
</body>
</html>
